<template>
  <div>
    <div class="container">
      <div class="handle-box">
        <el-select v-model="query.licence_state" placeholder="商户类型" class="handle-select mr10" @change="handleSearch(query.mer_name,query.licence_state)">
          <el-option key="1" label="有证" value="有证"></el-option>
          <el-option key="2" label="无证" value="无证"></el-option>
        </el-select>
        <el-input v-model="query.mer_name" placeholder="商户名称" class="handle-input mr10" @change="handleSearch(query.mer_name,query.licence_state)" ></el-input>
        <el-button type="primary" :icon="Search" @click="handleSearch(query.mer_name,query.licence_state)">搜索</el-button>
        <el-button type="primary" :icon="Plus" @click="create_ciga">新增</el-button>
      </div>
      <el-table :data="tableList" border class="table" ref="multipleTable" header-cell-class-name="table-header">
<!--        <el-table-column prop="mer_id" label="ID" width="55" align="center"></el-table-column>-->
        <el-table-column prop="mer_name" label="商户名称" width="250" align="center"></el-table-column>
        <el-table-column prop="mer_format" label="经营业态" align="center"></el-table-column>
        <el-table-column prop="mer_address" label="经营地" align="center">/</el-table-column>
        <el-table-column prop="mer_person" label="负责人" align="center"></el-table-column>
        <el-table-column prop="licence_state" align="center" label="证件状态"></el-table-column>
        <el-table-column prop="mer_record" label="记录人" align="center"></el-table-column>
        <el-table-column label="操作" width="220" align="center">
          <template #default="scope">
            <el-button text :icon="Edit" @click="handleEdit(scope.row)" >
              修改
            </el-button>
            <el-button text :icon="Delete" class="red" @click="merchant_delete(scope.$index,scope.row)" >
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <el-pagination
            background
            layout="total, prev, pager, next"
            :current-page="query.pageIndex"
            :page-size="query.pageSize"
            :total="pageTotal"
            @current-change="handlePageChange"
        ></el-pagination>
      </div>
    </div>

    <!-- 新增香烟弹出框 -->
    <el-dialog title="修改商户信息" v-model="createVisible" width="30%">
      <el-form label-width="140px">
        <el-form-item label="经营业态">
          <el-input v-model="create.mer_format"></el-input>
        </el-form-item>
        <el-form-item label="商户名称">
          <el-input v-model="create.mer_name"></el-input>
        </el-form-item>
        <el-form-item label="经营地址">
          <el-input type="textarea" v-model="create.mer_address" rows="2"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人名称">
          <el-input v-model="create.mer_person"></el-input>
        </el-form-item>
        <el-form-item label="民族">
          <el-select v-model="create.mer_nation" placeholder="请选择民族" class="handle-select mr10">
            <el-option key="1" label="汉族" value="汉族"></el-option>
            <el-option key="2" label="蒙古族" value="蒙古族"></el-option>
            <el-option key="3" label="回族" value="回族"></el-option>
            <el-option key="4" label="藏族" value="藏族"></el-option>
            <el-option key="5" label="维吾尔族" value="维吾尔族"></el-option>
            <el-option key="6" label="苗族" value="苗族"></el-option>
            <el-option key="7" label="彝族" value="彝族"></el-option>
            <el-option key="8" label="壮族" value="壮族"></el-option>
            <el-option key="9" label="布依族" value="布依族"></el-option>
            <el-option key="10" label="朝鲜族" value="朝鲜族"></el-option>
            <el-option key="11" label="满族" value="满族"></el-option>
            <el-option key="12" label="侗族" value="侗族"></el-option>
            <el-option key="13" label="瑶族" value="瑶族"></el-option>
            <el-option key="14" label="白族" value="白族"></el-option>
            <el-option key="15" label="土家族" value="土家族"></el-option>
            <el-option key="16" label="哈尼族" value="哈尼族"></el-option>
            <el-option key="17" label="哈萨克族" value="哈萨克族"></el-option>
            <el-option key="18" label="傣族" value="傣族"></el-option>
            <el-option key="19" label="黎族" value="黎族"></el-option>
            <el-option key="20" label="傈僳族" value="傈僳族"></el-option>
            <el-option key="21" label="佤族" value="佤族"></el-option>
            <el-option key="22" label="畲族" value="畲族"></el-option>
            <el-option key="23" label="高山族" value="高山族"></el-option>
            <el-option key="24" label="拉祜族" value="拉祜族"></el-option>
            <el-option key="25" label="水族" value="水族"></el-option>
            <el-option key="26" label="东乡族" value="东乡族"></el-option>
            <el-option key="27" label="纳西族" value="纳西族"></el-option>
            <el-option key="28" label="景颇族" value="景颇族"></el-option>
            <el-option key="29" label="柯尔克孜族" value="柯尔克孜族"></el-option>
            <el-option key="30" label="土族" value="土族"></el-option>
            <el-option key="31" label="达斡尔族" value="达斡尔族"></el-option>
            <el-option key="32" label="仫佬族" value="仫佬族"></el-option>
            <el-option key="33" label="羌族" value="羌族"></el-option>
            <el-option key="34" label="布朗族" value="布朗族"></el-option>
            <el-option key="35" label="撒拉族" value="撒拉族"></el-option>
            <el-option key="36" label="毛南族" value="毛南族"></el-option>
            <el-option key="37" label="仡佬族" value="仡佬族"></el-option>
            <el-option key="38" label="锡伯族" value="锡伯族"></el-option>
            <el-option key="39" label="阿昌族" value="阿昌族"></el-option>
            <el-option key="40" label="普米族" value="普米族"></el-option>
            <el-option key="41" label="塔吉克族" value="塔吉克族"></el-option>
            <el-option key="42" label="怒族" value="怒族"></el-option>
            <el-option key="43" label="乌孜别克族" value="乌孜别克族"></el-option>
            <el-option key="44" label="俄罗斯族" value="俄罗斯族"></el-option>
            <el-option key="45" label="鄂温克族" value="鄂温克族"></el-option>
            <el-option key="46" label="德昂族" value="德昂族"></el-option>
            <el-option key="47" label="保安族" value="保安族"></el-option>
            <el-option key="48" label="裕固族" value="裕固族"></el-option>
            <el-option key="49" label="京族" value="京族"></el-option>
            <el-option key="50" label="塔塔尔族" value="塔塔尔族"></el-option>
            <el-option key="51" label="独龙族" value="独龙族"></el-option>
            <el-option key="52" label="鄂伦春族" value="鄂伦春族"></el-option>
            <el-option key="53" label="赫哲族" value="赫哲族"></el-option>
            <el-option key="54" label="门巴族" value="门巴族"></el-option>
            <el-option key="55" label="珞巴族" value="珞巴族"></el-option>
            <el-option key="56" label="基诺族" value="基诺族"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="商户负责人年龄">
          <el-input v-model="create.mer_age" @input="checkNumberInput"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人家庭住址">
          <el-input v-model="create.mer_home"></el-input>
        </el-form-item>
        <el-form-item label="记录者">
          <el-input v-model="create.mer_record"></el-input>
        </el-form-item>
        <el-form-item label="记录日期">
          <el-date-picker v-model="create.date_of_record" type="datetime" placeholder="选择日期" value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="许可证有效日期">
          <el-date-picker v-model="create.date_of_effect" type="datetime" placeholder="选择日期" value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="发证日期">
          <el-date-picker v-model="create.date_of_issue" type="datetime" placeholder="选择日期" value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="商户负责人籍贯">
          <el-input v-model="create.mer_hometown"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人身份证号">
          <el-input v-model="create.mer_id_number"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人联系电话">
          <el-input v-model="create.mer_tel"></el-input>
        </el-form-item>
        <el-form-item label="工商执照号">
          <el-input v-model="create.business_licence_code"></el-input>
        </el-form-item>
        <el-form-item label="证件状态">
          <el-select v-model="create.licence_state" placeholder="请选择"   clearable="" class="handle-select mr10">
            <el-option key="1" label="有证" value="有证" ></el-option>
            <el-option key="2" label="无证" value="无证"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="仓储地址">
          <el-input v-model="create.storage_address" type="textarea" rows="2"></el-input>
        </el-form-item>
        <el-form-item label="烟草专卖零售许可证">
          <el-input v-model="create.retail_licence_code"></el-input>
        </el-form-item>
        <el-form-item label="持证类型">
          <el-input v-model="create.category"></el-input>
        </el-form-item>
<!--        <el-form-item label="区域ID">-->
<!--          <el-input v-model="create.area_id"></el-input>-->
<!--        </el-form-item>-->
        <el-form-item label="邮政编码">
          <el-input v-model="create.mer_zip_code"></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
				<span class="dialog-footer">
					<el-button @click="createVisible = false">取 消</el-button>
					<el-button type="primary" @click="saveCreate">确 定</el-button>
				</span>
      </template>
    </el-dialog>

    <!-- 编辑弹出框 -->
    <el-dialog title="修改商户信息" v-model="editVisible" align="center" width="30%">
      <el-form label-width="140px">
        <el-form-item label="经营业态">

          <el-input v-model="form.mer_format"></el-input>
        </el-form-item>
        <el-form-item label="商户名称">
          <el-input v-model="form.mer_name"></el-input>
        </el-form-item>
        <el-form-item label="经营地址">
          <el-input v-model="form.mer_address"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人名称">
          <el-input v-model="form.mer_person"></el-input>
        </el-form-item>
        <el-form-item label="民族">
          <el-select v-model="form.mer_nation" placeholder="请选择民族" class="handle-select mr10">
            <el-option key="1" label="汉族" value="汉族"></el-option>
            <el-option key="2" label="蒙古族" value="蒙古族"></el-option>
            <el-option key="3" label="回族" value="回族"></el-option>
            <el-option key="4" label="藏族" value="藏族"></el-option>
            <el-option key="5" label="维吾尔族" value="维吾尔族"></el-option>
            <el-option key="6" label="苗族" value="苗族"></el-option>
            <el-option key="7" label="彝族" value="彝族"></el-option>
            <el-option key="8" label="壮族" value="壮族"></el-option>
            <el-option key="9" label="布依族" value="布依族"></el-option>
            <el-option key="10" label="朝鲜族" value="朝鲜族"></el-option>
            <el-option key="11" label="满族" value="满族"></el-option>
            <el-option key="12" label="侗族" value="侗族"></el-option>
            <el-option key="13" label="瑶族" value="瑶族"></el-option>
            <el-option key="14" label="白族" value="白族"></el-option>
            <el-option key="15" label="土家族" value="土家族"></el-option>
            <el-option key="16" label="哈尼族" value="哈尼族"></el-option>
            <el-option key="17" label="哈萨克族" value="哈萨克族"></el-option>
            <el-option key="18" label="傣族" value="傣族"></el-option>
            <el-option key="19" label="黎族" value="黎族"></el-option>
            <el-option key="20" label="傈僳族" value="傈僳族"></el-option>
            <el-option key="21" label="佤族" value="佤族"></el-option>
            <el-option key="22" label="畲族" value="畲族"></el-option>
            <el-option key="23" label="高山族" value="高山族"></el-option>
            <el-option key="24" label="拉祜族" value="拉祜族"></el-option>
            <el-option key="25" label="水族" value="水族"></el-option>
            <el-option key="26" label="东乡族" value="东乡族"></el-option>
            <el-option key="27" label="纳西族" value="纳西族"></el-option>
            <el-option key="28" label="景颇族" value="景颇族"></el-option>
            <el-option key="29" label="柯尔克孜族" value="柯尔克孜族"></el-option>
            <el-option key="30" label="土族" value="土族"></el-option>
            <el-option key="31" label="达斡尔族" value="达斡尔族"></el-option>
            <el-option key="32" label="仫佬族" value="仫佬族"></el-option>
            <el-option key="33" label="羌族" value="羌族"></el-option>
            <el-option key="34" label="布朗族" value="布朗族"></el-option>
            <el-option key="35" label="撒拉族" value="撒拉族"></el-option>
            <el-option key="36" label="毛南族" value="毛南族"></el-option>
            <el-option key="37" label="仡佬族" value="仡佬族"></el-option>
            <el-option key="38" label="锡伯族" value="锡伯族"></el-option>
            <el-option key="39" label="阿昌族" value="阿昌族"></el-option>
            <el-option key="40" label="普米族" value="普米族"></el-option>
            <el-option key="41" label="塔吉克族" value="塔吉克族"></el-option>
            <el-option key="42" label="怒族" value="怒族"></el-option>
            <el-option key="43" label="乌孜别克族" value="乌孜别克族"></el-option>
            <el-option key="44" label="俄罗斯族" value="俄罗斯族"></el-option>
            <el-option key="45" label="鄂温克族" value="鄂温克族"></el-option>
            <el-option key="46" label="德昂族" value="德昂族"></el-option>
            <el-option key="47" label="保安族" value="保安族"></el-option>
            <el-option key="48" label="裕固族" value="裕固族"></el-option>
            <el-option key="49" label="京族" value="京族"></el-option>
            <el-option key="50" label="塔塔尔族" value="塔塔尔族"></el-option>
            <el-option key="51" label="独龙族" value="独龙族"></el-option>
            <el-option key="52" label="鄂伦春族" value="鄂伦春族"></el-option>
            <el-option key="53" label="赫哲族" value="赫哲族"></el-option>
            <el-option key="54" label="门巴族" value="门巴族"></el-option>
            <el-option key="55" label="珞巴族" value="珞巴族"></el-option>
            <el-option key="56" label="基诺族" value="基诺族"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="商户负责人年龄">
          <el-input v-model="form.mer_age" @input="checkNumberInput"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人家庭住址">
          <el-input v-model="form.mer_home"></el-input>
        </el-form-item>
        <el-form-item label="记录者">
          <el-input v-model="form.mer_record"></el-input>
        </el-form-item>
        <el-form-item label="记录日期">
          <el-date-picker v-model="form.date_of_record" type="datetime" placeholder="选择日期" value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="许可证有效日期">
          <el-date-picker v-model="form.date_of_effect" type="datetime" placeholder="选择日期" value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="发证日期">
          <el-date-picker v-model="form.date_of_issue" type="datetime" placeholder="选择日期" value-format="YYYY-MM-DD HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="商户负责人籍贯">
          <el-input v-model="form.mer_hometown"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人身份证号">
          <el-input v-model="form.mer_id_number"></el-input>
        </el-form-item>
        <el-form-item label="商户负责人联系电话">
          <el-input v-model="form.mer_tel"></el-input>
        </el-form-item>
        <el-form-item label="工商执照号">
          <el-input v-model="form.business_licence_code"></el-input>
        </el-form-item>
        <el-form-item label="证件状态">
          <el-input v-model="form.licence_state"></el-input>
        </el-form-item>
        <el-form-item label="仓储地址">
          <el-input v-model="form.storage_address"></el-input>
        </el-form-item>
        <el-form-item label="烟草专卖零售许可证">
          <el-input v-model="form.retail_licence_code"></el-input>
        </el-form-item>
        <el-form-item label="持证类型">
          <el-input v-model="form.category"></el-input>
        </el-form-item>
<!--        <el-form-item label="区域ID">-->
<!--          <el-input v-model="form.area_id"></el-input>-->
<!--        </el-form-item>-->
        <el-form-item label="邮政编码">
          <el-input v-model="form.mer_zip_code"></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
				<span class="dialog-footer">
					<el-button @click="editVisible = false">取 消</el-button>
					<el-button type="primary" @click="saveEdit">确 定</el-button>
				</span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts" name="table_jy">
import { ref, reactive } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
import {
  fetchData_mer,
  fetchData_tobacco,
  legal_clause_delete,
  merchant_message_delete,
  mer_Create,
  mer_Edit,
  tobacco_Create,
  tobacco_Edit
} from '../api/index';

interface TableItem {
  mer_id:number;
  mer_format:string;
  mer_address:string;
  mer_person:string;
  mer_record:string;
  date_of_record:string;
  date_of_effect:string;
  date_of_issue:string;
  mer_hometown:string;
  mer_id_number:string;
  mer_tel:string;
  business_licence_code:string;
  licence_state:string;
  storage_address:string;
  retail_licence_code:string;
  category:string;
  area_id:number;
  mer_zip_code:number;
  mer_name:string;
}

const query = reactive({
  mer_name:'',
  licence_state: '',
  pageIndex: 1,
  pageSize: 10
});


const tableData = ref<TableItem[]>([]);
const tableList = ref<TableItem[]>([]); // 用于存放分页数据的列表
const pageTotal = ref(0);
// 获取表格数据
const getData = (mer_name:string='',licence_state:string='' ,mer_person:string='',mer_id:number) => {
  fetchData_mer(mer_name,licence_state,mer_person,mer_id).then(res => {
    tableList.value = [];
    tableData.value = res.data.data;
    pageTotal.value = res.data.data.length;
    // 根据页码确定下标位置
    const index: number = query.pageIndex * query.pageSize - query.pageSize;
    for (let i = index; i < index + query.pageSize; i++) {
      // 防止数组下标越界
      if (i <= tableData.value.length - 1) {
        tableList.value.push(tableData.value[i])
      } else {
        // 越界就不再循环
        break;
      }
    }
  });
};
getData();

// 查询操作
const handleSearch = (mer_name:string='',licence_state:string='',mer_id:number) => {
  query.pageIndex = 1;
  getData(mer_name,licence_state,'',mer_id);
};
// 分页导航
const handlePageChange = (val: number) => {
  query.pageIndex = val;
  getData('','','','','');
};

// 表格编辑时弹窗和保存
const createVisible = ref(false);
const create_ciga = ()=>{
  createVisible.value = true;
}

let create = reactive({
            mer_format:'',
            mer_address:'',
            mer_person:'',
            mer_record:'',
            date_of_record:'',
            date_of_effect:'',
            date_of_issue:'',
            mer_hometown:'',
            mer_id_number:'',
            mer_tel:'',
            business_licence_code:'',
            licence_state:'',
            storage_address:'',
            retail_licence_code:'',
            category:'',
            area_id:0,
            mer_zip_code:'',
            mer_name:'',
            mer_age:'',
            mer_nation:'',
            mer_home:'',
});
const saveCreate = () =>{
  if(create.mer_format.length==0){
    alert("请输入经营业态")
  }else if(create.mer_name.length==0){
    alert("请输入商户名称")
  }else if(create.mer_address.length==0){
    alert("请输入商户名称")
  }else if(create.mer_person.length==0){
    alert("请输入商户负责人名称")
  }else if(create.date_of_record.length==0){
    alert("请选择记录日期")
  }else if(create.date_of_effect.length==0){
    alert("请选择许可证有效日期")
  }else if(create.date_of_issue.length==0){
    alert("请选择发证日期")
  }else if(create.mer_hometown.length==0){
    alert("请输入商户负责人籍贯")
  }else if(create.mer_id_number.length==0){
    alert("请输入商户负责人身份证号")
  }else if(create.mer_tel.length==0){
    alert("请输入商户负责人联系电话")
  }else if(create.licence_state.length==0){
    alert("请选择证件状态")
  }else if(create.retail_licence_code.length==0){
    alert("请输入烟草专卖零售许可证")
  }else if(create.mer_nation.length==0){
    alert("请选择商户负责人民族")
  }else if(create.mer_age.length==0){
    alert("请输入商户负责人年龄")
  }else if(create.mer_home.length==0){
    alert("请输入商户负责人家庭住址")
  }else{
    mer_Create(
            create.mer_format,
            create.mer_address,
            create.mer_person,
            create.mer_record,
            create.date_of_record,
            create.date_of_effect,
            create.date_of_issue,
            create.mer_hometown,
            create.mer_id_number,
            create.mer_tel,
            create.business_licence_code,
            create.licence_state,
            create.storage_address,
            create.retail_licence_code,
            create.category,
            // create.area_id,
            create.mer_zip_code,
            create.mer_name,
            create.mer_nation,
            create.mer_age,
            create.mer_home,
    ).then(res=>{
      if (res.data.message ==="success"){
        ElMessage.success(`添加商户成功`);
        createVisible.value=false;
      }else {
        ElMessageBox.confirm('添加失败', '提示', {
          type: 'warning'
        })
      }
    })
  }

}

const merchant_delete=(index:number,row:any)=>{
  // 二次确认删除
  ElMessageBox.confirm('确定要删除吗？', '提示', {
    type: 'warning'
  }).then(() => {
    merchant_message_delete(row.mer_id).then(res=>{
      if (res.data.message === "success"){
        tableData.value.splice(index, 1);
        getData();
        ElMessage.success('删除成功');

      }else {
        ElMessageBox.confirm('删除失败', '提示', {
          type: 'warning'
        })
      }
    })
  })
          .catch(() => {});
}

// 表格编辑时弹窗和保存
const editVisible = ref(false);
let form = reactive({
  mer_id:0,
  mer_format:'',
  mer_address:'',
  mer_person:'',
  mer_record:'',
  date_of_record:'',
  date_of_effect:'',
  date_of_issue:'',
  mer_hometown:'',
  mer_id_number:'',
  mer_tel:'',
  business_licence_code:'',
  licence_state:'',
  storage_address:'',
  retail_licence_code:'',
  category:'',
  area_id:'',
  mer_zip_code:'',
  mer_name:'',
  mer_home:'',
  mer_nation:'',
  mer_age:'',
});

const handleEdit = (row: any) => {
      form.mer_id=row.mer_id;
      form.mer_format=row.mer_format;
      form.mer_address=row.mer_address;
      form.mer_person=row.mer_person;
      form.mer_record=row.mer_record;
      form.date_of_record=row.date_of_record;
      form.date_of_effect=row.date_of_effect;
      form.date_of_issue=row.date_of_issue;
      form.mer_hometown=row.mer_hometown;
      form.mer_id_number=row.mer_id_number;
      form.mer_tel=row.mer_tel;
      form.business_licence_code=row.business_licence_code;
      form.licence_state=row.licence_state;
      form.storage_address=row.storage_address;
      form.retail_licence_code=row.retail_licence_code;
      form.category=row.category;
      form.area_id=row.area_id;
      form.mer_zip_code=row.mer_zip_code;
      form.mer_name=row.mer_name;
      form.mer_home=row.mer_home;
      form.mer_nation=row.mer_nation;
      form.mer_age=row.mer_age;
      editVisible.value = true;
};
const saveEdit = () => {
  if(form.mer_format.length==0){
    alert("请输入经营业态")
  }else if(form.mer_name.length==0){
    alert("请输入商户名称")
  }else if(form.mer_address.length==0){
    alert("请输入商户名称")
  }else if(form.mer_person.length==0){
    alert("请输入商户负责人名称")
  }else if(form.date_of_record.length==0){
    alert("请选择记录日期")
  }else if(form.date_of_effect.length==0){
    alert("请选择许可证有效日期")
  }else if(form.date_of_issue.length==0){
    alert("请选择发证日期")
  }else if(form.mer_hometown.length==0){
    alert("请输入商户负责人籍贯")
  }else if(form.mer_id_number.length==0){
    alert("请输入商户负责人身份证号")
  }else if(form.mer_tel.length==0){
    alert("请输入商户负责人联系电话")
  }else if(form.licence_state.length==0){
    alert("请选择证件状态")
  }else if(form.retail_licence_code.length==0){
    alert("请输入烟草专卖零售许可证")
  }else if(form.mer_nation.length==0){
    alert("请选择商户负责人民族")
  }else if(form.mer_age.length==0){
    alert("请输入商户负责人年龄")
  }else if(form.mer_home.length==0){
    alert("请输入商户负责人家庭住址")
  }else{
    editVisible.value = false;
    mer_Edit(
            form.mer_id,
            form.mer_format,
            form.mer_address,
            form.mer_person,
            form.mer_record,
            form.date_of_record,
            form.date_of_effect,
            form.date_of_issue,
            form.mer_hometown,
            form.mer_id_number,
            form.mer_tel,
            form.business_licence_code,
            form.licence_state,
            form.storage_address,
            form.retail_licence_code,
            form.category,
            // form.area_id,
            form.mer_zip_code,
            form.mer_name,
            form.mer_age,
            form.mer_home,
            form.mer_nation
    ).then(res=>{
      if (res.data.message ==="success"){
        ElMessage.success(`修改成功`);
        getData();
      }else {
        ElMessageBox.confirm('修改失败', '提示', {
          type: 'warning'
        })
      }
    });
  }


};

</script>

<style scoped>
.handle-box {
  margin-bottom: 20px;
}

.handle-select {
  width: 120px;
}

.handle-input {
  width: 300px;
}
.table {
  width: 100%;
  font-size: 14px;
}
.red {
  color: #ff0000;
}
.mr10 {
  margin-right: 10px;
}
.table-td-thumb {
  display: block;
  margin: auto;
  width: 40px;
  height: 40px;
}

.handle-box button{
  background-color: #00a854;
}
.dialog-footer button{
  background-color: #00a854;
  color:white;
}
</style>
